<template>
    <div>
        <el-card class="box-card" shadow="never">
            <div slot="header" class="clearfix">
                <span class="card-title">{{ title }}</span>
                <el-button style="float: right" size="mini" type="primary"
                    @click="() => handleSave(false)">保存</el-button>
                <el-button style="float: right; margin-right: 10px" size="mini" v-if="!this.id"
                    @click="() => handleSave(true)">保存并新增</el-button>
            </div>
            <div class="text item">
                <el-form :model="taxrate" :rules="rules" ref="taxrateForm" label-width="100px" label-position="left">
                    <el-form-item label="编号" prop="code">
                        <el-input v-model="taxrate.code"></el-input>
                    </el-form-item>
                    <el-form-item label="名称" prop="name">
                        <el-input v-model="taxrate.name"></el-input>
                    </el-form-item>
                    <el-form-item label="税率" prop="rate">
                        <el-input-number v-model="taxrate.rate" :precision="2" :step="0.1" :max="1"
                            :controls="false"></el-input-number>
                    </el-form-item>

                    <el-form-item label="激活" prop="activated">
                        <el-switch v-model="taxrate.activated"> </el-switch>
                    </el-form-item>
                </el-form>
            </div>
        </el-card>
    </div>
</template>
<script>
import { getTaxRate, addTaxRate, updateTaxRate } from "@/api/taxrate";
export default {
    data() {
        return {
            taxrate: { id: null, code: null, name: null, activated: true, rate: null },
            rules: {
                code: [{ required: true, message: "请填写编号", trigger: "blur" }],
                name: [{ required: true, message: "请填写名称", trigger: "blur" }],
                rate: [{ required: true, message: "请填写税率", trigger: "blur" }],
            },
            title: "",
        };
    },
    methods: {
        getData() {
            if (!this.id) return;
            getTaxRate(this.id).then((res) => {
                this.taxrate = res || {};
            });
        },
        handleSave(afterAdd) {
            this.$refs.taxrateForm.validate((valid) => {
                if (valid) {
                    this.saveData(afterAdd);
                } else {
                    console.log("error submit!!");
                    return false;
                }
            });
        },
        saveData(afterAdd) {
            if (!this.id) {
                addTaxRate(this.taxrate).then((res) => {
                    if (!res) return;
                    this.$notify({
                        title: "成功",
                        message: "保存成功",
                        type: "success",
                        position: "bottom-right",
                    });
                    if (afterAdd) {
                        this.taxrate = {};
                    } else {
                        this.$emit("refresh", res);
                    }
                });
            } else {
                updateTaxRate(this.taxrate).then((res) => {
                    if (!res) return;
                    this.$notify({
                        title: "成功",
                        message: "保存成功",
                        type: "success",
                        position: "bottom-right",
                    });
                    if (afterAdd) {
                        this.taxrate = {};
                    } else {
                        this.$emit("refresh", res);
                    }
                });
            }
        },
    },
    mounted() {
        this.title = this.id ? "编辑" : "新增";
        this.getData();
    },
    props: {
        id: {
            type: String,
            default: "",
        },
    },
};
</script>
<style scoped></style>